body {background-color: #FFFFFF;}
.etichette10 {  font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 10px; text-align: justify; font-style: normal; line-height: normal; font-weight: normal; color: #62748C}
.etichette12 {  font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 12px; text-align: justify; font-style: normal; line-height: normal; font-weight: normal; color: #62748C}
.etichette14{  font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 14px; text-align: justify; font-style: normal; line-height: normal; font-weight: normal; color: #62748C}
.etichettegr12 {  font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 12px; text-align: justify; font-style: normal; line-height: normal; font-weight: bold; color: #62748C}
.etichettegr14{  font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 14px; text-align: justify; font-style: normal; line-height: normal; font-weight: bold; color: #62748C}
.giustificato18 {  font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 18px; text-align: justify; font-style: normal; line-height: normal; font-weight: normal; color: #000000}
.giustificato14 {  font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 14px; text-align: justify; font-style: normal; line-height: normal; font-weight: normal; color: #000000}
.giustificato12 {  font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 12px; text-align: justify; font-style: normal; line-height: normal; font-weight: normal; color: #000000}
.giustificato12importo {  font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 12px; text-align: right; font-style: normal; line-height: normal; font-weight: normal; color: #000000}
.giustificato12left {  font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 12px; text-align: left; font-style: normal; line-height: normal; font-weight: normal; color: #000000}
.giustificato12leftgr {  font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 12px; text-align: left; font-style: normal; line-height: normal; font-weight: bold; color: #000000}
.giustificato10 {  font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 10px; text-align: justify; font-style: normal; line-height: normal; font-weight: normal; color: #000000}
.grassetto18 {  font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 18px; font-style: normal; line-height: normal; font-weight: bold; color:#000000}
.grassetto16 {  font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 16px; font-style: normal; line-height: normal; font-weight: bold; color:#000000}
.grassetto14 {  font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 14px; font-style: normal; line-height: normal; font-weight: bold; color:#000000}
.grassetto12 {  font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 12px; font-style: normal; line-height: normal; font-weight: bold; color: #000000}
.rosso10gr { font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 10px; text-align: justify; font-style: normal; line-height: normal; font-weight: bold; color: #F92B38}

.titoli { font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 16px; text-align: justify; font-style: normal; line-height: normal; font-weight: bold; color: #FF0000}
.scritta { font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 24px; text-align: justify; font-style: normal; line-height: normal; font-weight: bold; color: #FF0000}
.nominativi { font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 12px; font-style: normal; line-height: normal; font-weight: bold; color: #000000 ; text-transform: capitalize}
.bottoni10 { font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 10px; text-align: center; font-style: normal; line-height: normal; font-weight: normal; color: #000000 }
.bottoni { font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 14px; text-align: center; font-style: normal; line-height: normal; font-weight: normal; color: #000000 }
.bottoni12 { font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 12px; text-align: center; font-style: normal; line-height: normal; font-weight: normal; color: #000000 }
.bianco { font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 18px; text-align: justify; font-style: normal; line-height: normal; font-weight: bold; color: #FFFFFF}
 A:link { font-family: Verdana, Arial, Helvetica, sans-serif ; font-size: 14px; font-style: normal; color: #62748C; line-height: normal; font-weight: normal; text-decoration: none}
 A:visited  { font-family: Verdana, Arial, Helvetica, sans-serif ; font-size: 14px; color:#62748C; font-style: normal; line-height: normal; font-weight: normal; text-decoration: none}
 A:hover {font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 14px; font-style: normal; line-height: normal; font-weight: normal; color: #62748C; text-decoration: none}
.menualto {font-family: Verdana, Arial, Helvetica, sans-serif;font-size: 12px;font-style: normal;line-height: normal;font-weight: bold;color: #fcea0a;background-color: #a5a8ad;text-align: center;vertical-align: middle;}
.menualtosmall {font-family: Verdana, Arial, Helvetica, sans-serif;font-size: 4px;font-style: normal;line-height: normal;font-weight: bold;color: #fcea0a;background-color: #a5a8ad;text-align: center;vertical-align: middle;}
.menualtobarrettanull {font-family: Verdana, Arial, Helvetica, sans-serif;font-size: 8px;font-style: normal;line-height: normal;font-weight: normal;color: #fcea0a;background-color: #a5a8ad;text-align: center;vertical-align: middle;}
.menualtosel {font-family: Verdana, Arial, Helvetica, sans-serif;font-size: 12px;font-style: normal;line-height: normal;font-weight: bold;color: #04ae56;background-color: #a5a8ad;text-align: center;vertical-align: middle;}
.menualtobarretta {font-family: Verdana, Arial, Helvetica, sans-serif;font-size: 8px;font-style: normal;line-height: normal;font-weight: bold;text-transform: uppercase;color: #fcea0a;background-color: #fcea0a;text-align: center;vertical-align: middle;}
.menulato {font-family: Verdana, Arial, Helvetica, sans-serif;font-size: 12px;font-style: normal;line-height: normal;font-weight: normal;color: #a5a8ad;text-align: left;vertical-align: middle;}
.menulatosel {font-family: Verdana, Arial, Helvetica, sans-serif;font-size: 12px;font-style: normal;line-height: normal;font-weight: normal;color: #0fa55b;text-align: left;vertical-align: middle;}
.mail{  font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 14px; text-align: justify; font-style: normal; line-height: normal; font-weight: bold; color: #000000;}
.giust12maiuscolo {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
	text-align: justify;
	font-style: normal;
	line-height: normal;
	font-weight: normal;
	color: #000000;
	text-transform: uppercase;
}


#EMAIL { background: #FFFFFF url('images/invio_email.gif') no-repeat 7px;  padding-left: 25px; }
#nome { background: #FFFFFF url('images/utenteform.png') no-repeat 7px;  padding-left: 23px; }
#cognome { background: #FFFFFF url('images/utenteform.png') no-repeat 7px;  padding-left: 23px; }
#telefono { background: #FFFFFF url('images/cellulare.png') no-repeat 7px;  padding-left: 23px; }
#password { background: #FFFFFF url('images/password.jpg') no-repeat 7px;  padding-left: 23px; }
#utente { background: #FFFFFF url('images/utenteform.png') no-repeat 7px;  padding-left: 23px; }
#data { background: #FFFFFF url('images/smallico_Calendar.gif') no-repeat 7px;  padding-left: 25px; }
#datan { background: #FFFFFF url('images/smallico_Calendar.gif') no-repeat 7px;  padding-left: 25px; }

#submit {padding: 0; width: 120px; background: #0F0;}
#submit2 {padding: 0; width: 120px; background: #F00;}
#submit3 {padding: 0; width: 120px; background: #94AFC0;}


.container_450{width:450px;display:inline-block;}
.container_530{width:530px;display:inline-block;}
.container_960{width:960px;display:inline-block;}

input, textarea, select {
    background: #FFFFFF;
    border: 1px solid #62748C;
    color: #62748C;
    padding: 0 5px;    
}


#formcontatto {
    margin: 10px auto;
    background: #94AFC0;
    padding: 10px;
    overflow: hidden;
    -moz-border-radius: 15px;
    -webkit-border-radius: 15px;
    border-radius: 15px;
	border: 1px solid;
	border-color:#330099;
}

#formlogin {
    margin: 5px auto;
    background: #FFFF99;
    padding: 4px;
    overflow: hidden;
    -moz-border-radius: 15px;
    -webkit-border-radius: 15px;
    border-radius: 15px;
	border: 1px solid;
	border-color:#330099;
}

.loginimage {background-image: url(images/logostampe.gif); background-repeat: repeat; background-color:#FFFFCC}

#tabellacolsfondo {margin:0 px; padding: 0 px; border: 0px solid; width:100%; background-color: #FFFFFF; vertical-align:top} 

#tabellacolsfondobordi {margin:0 px; padding: 0 px; border: 1px solid #000; width:100%; background-color: #FFFFFF; vertical-align:top;} 
 
#tabella_listanosfondo
{
	background: #FFFFFF;
	border: 1px solid #330099;
	border-collapse: collapse;
	width: 100%;
}

#tabella_listanosfondo th {border-bottom: 2px solid #330099; background: #CC6633;padding: 2 px;}
#tabella_listanosfondo td {border: 1px solid #330099;padding: 2 px;}

/* ==========================================================================
   RESPONSIVE - area di manutenzione interna (/manutenzione/)
   Blocco additivo: NON modifica il layout desktop.
   Incollare in fondo a stileadmin.css.

   IMPORTANTE: perche' abbia effetto su smartphone, le pagine .asp della
   cartella /manutenzione/ devono avere nel <head> il meta viewport:
   <meta name="viewport" content="width=device-width, initial-scale=1">
   ========================================================================== */

*, *::before, *::after { box-sizing: border-box; }

img { max-width: 100%; height: auto; }

/* Riquadri/form e colonne a larghezza fissa resi fluidi
   (il desktop resta uguale grazie a max-width pari alla misura originale) */
#formlogin            { width: 100% !important; max-width: 450px; }
#formcontatto         { width: 100% !important; max-width: 600px; }
#tabellacolsfondobordi{ width: 100% !important; }
.container_450        { width: 100% !important; max-width: 450px; }
.container_530        { width: 100% !important; max-width: 530px; }
.container_960        { width: 100% !important; max-width: 960px; }
input, textarea, select { max-width: 100%; }

/* Tablet / finestre strette: le tabelle elenco scorrono in orizzontale */
@media (max-width: 1000px) {
  #tabella_lista, #tabella_listanosfondo {
      display: block; width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch;
  }
}

/* Smartphone e tablet in verticale: layout a colonna singola */
@media (max-width: 900px) {

  /* Le tabelle di impaginazione a larghezza fissa in pixel diventano blocchi.
     Escluse le tabelle a width="100%" e le tabelle dati/elenco. */
  table[width]:not([width$="%"]):not(#tabella_lista):not(#tabella_listanosfondo) {
      display: block !important; width: 100% !important;
  }
  table[width]:not([width$="%"]):not(#tabella_lista):not(#tabella_listanosfondo) > tbody,
  table[width]:not([width$="%"]):not(#tabella_lista):not(#tabella_listanosfondo) > tbody > tr,
  table[width]:not([width$="%"]):not(#tabella_lista):not(#tabella_listanosfondo) > tbody > tr > td {
      display: block !important; width: auto !important; height: auto !important;
  }
  /* Le celle-contenitore diventano regioni scorrevoli in orizzontale: cosi'
     le griglie dati larghe (molte colonne, senza id) e le toolbar/form larghi
     scorrono lateralmente invece di allargare tutta la pagina. */
  table[width]:not([width$="%"]):not(#tabella_lista):not(#tabella_listanosfondo) > tbody > tr > td {
      overflow-x: auto; -webkit-overflow-scrolling: touch;
  }

  /* Contenitori a tutta larghezza impilati */
  #tabellacolsfondo, #tabellacolsfondobordi { display: block !important; width: 100% !important; }
  #tabellacolsfondo > tbody, #tabellacolsfondo > tbody > tr, #tabellacolsfondo > tbody > tr > td,
  #tabellacolsfondobordi > tbody, #tabellacolsfondobordi > tbody > tr, #tabellacolsfondobordi > tbody > tr > td {
      display: block !important; width: auto !important; height: auto !important;
  }

  /* Box di login / form contatto a tutta larghezza */
  .loginimage { width: 100% !important; }
  #formlogin, #formlogin table, #formcontatto, #formcontatto table { width: 100% !important; }

  /* FORM DI INSERIMENTO/MODIFICA: le tabelle di layout dei form (width="100%"
     che contengono campi) vengono impilate -> etichetta sopra, campo sotto.
     Le tabelle senza campi (es. le griglie dati) NON sono toccate e restano
     tabelle scorrevoli. Serve un browser che supporti :has() (tutti i recenti). */
  table[width$="%"]:has(input), table[width$="%"]:has(textarea), table[width$="%"]:has(select) {
      display: block !important;
  }
  table[width$="%"]:has(input) > tbody, table[width$="%"]:has(input) > tbody > tr, table[width$="%"]:has(input) > tbody > tr > td,
  table[width$="%"]:has(textarea) > tbody, table[width$="%"]:has(textarea) > tbody > tr, table[width$="%"]:has(textarea) > tbody > tr > td,
  table[width$="%"]:has(select) > tbody, table[width$="%"]:has(select) > tbody > tr, table[width$="%"]:has(select) > tbody > tr > td {
      display: block !important; width: auto !important; height: auto !important;
  }

  /* Campi di input a tutta larghezza; caselle, pulsanti e simili restano piccoli */
  input, textarea, select { width: 100% !important; }
  input[type="checkbox"], input[type="radio"], input[type="submit"],
  input[type="button"], input[type="image"], input[type="reset"] { width: auto !important; }
}

/* Smartphone piccoli: titoli piu' compatti */
@media (max-width: 480px) {
  .titoli, .scritta { font-size: 16px; }
}